require(["./config"], () => {
    require(['template', 'request', 'header', 'footer', 'jquery', 'cbl'], (template, req, header) => {
        class Cart {
            constructor() {
                this.prodList = [];
                this.allCount = 0;
                this.allPrice = 0;
                this.checkNum = 0;
                this.checkAll = true;
                this.init();
            }
            init() {
                this.allCount = 0;
                this.allPrice = 0;
                this.checkNum = 0;
                let prodList = localStorage.getItem('prodList');
                if (prodList) {
                    this.prodList = JSON.parse(prodList);
                    $(".shop-list").html(template("shopList", { prodList: this.prodList, checkAll: this.checkAll }));
                    this.prodList.forEach(item => {
                        this.allCount += item.count;
                        if (item.isChecked) {
                            this.checkNum += item.count;
                            this.allPrice += ((item.price / 100) * item.count);
                        }
                    })
                    $(".left2 .allCount").html(this.allCount);
                    $(".left2 .hasChecked").html(this.checkNum);
                    $(".right2 .price").html(this.allPrice.toFixed(2));
                }
                header.computedCount()
                this.delProd()
                this.changeCount();
                this.check();
                this.getCartData();
            }
            getCartData() {
                req.getCartData()
                    .then(res => {
                        this.render(res.data.pageList)
                    })
            }
            render(list) {
                $(".content .prod").html(template("cartGoods", { list }));
            }
            delProd() {
                const dels = document.querySelectorAll('.cart-list .del');
                for (let i = 0; i < dels.length; i++) {
                    dels[i].onclick = () => {
                        this.prodList.splice(i, 1);
                        localStorage.setItem('prodList', JSON.stringify(this.prodList));
                        this.init();
                    }
                }
            }
            changeCount() {
                const reduce = document.querySelectorAll('.cart-list .sp1'),
                    add = document.querySelectorAll('.cart-list .sp2'),
                    that = this;
                for (let i = 0; i < reduce.length; i++) {
                    reduce[i].onclick = function () {
                        that.addReduce('reduce', that, this)
                    }
                    add[i].onclick = function () {
                        that.addReduce('add', that, this)
                    }
                }
            }
            addReduce(str, that, _this) {
                const id = $(_this).parent().attr('id') - 0;
                that.prodList.forEach(item => {
                    if (item.id === id) {
                        if (str === 'reduce') {
                            if (item.count <= 1) {
                                return;
                            }
                            item.count--;
                        } else {
                            item.count++;
                        }
                        localStorage.setItem('prodList', JSON.stringify(that.prodList));
                        that.init();
                    }
                })
            }
            check() {
                const that = this;
                const all = $(".checkAll");
                for(let i=0; i < all.length; i++){
                    all[i].onclick = function () {
                        that.checkAll = !that.checkAll;
                        that.prodList.forEach(item => {
                            item.isChecked = that.checkAll;
                        })
                        localStorage.setItem('prodList', JSON.stringify(that.prodList));
                        that.init();
                    }
                }
                const inps = $('tr .checkBox .checkbox');
                for (let i = 0; i < inps.length; i++) {
                    inps[i].onclick = function () {
                        that.prodList[i].isChecked = !that.prodList[i].isChecked
                        const flag = that.prodList.every(item => {
                            return item.isChecked;
                        })
                        that.checkAll = flag;
                        localStorage.setItem('prodList', JSON.stringify(that.prodList));
                        that.init();
                    }
                }
            }
        }
        return new Cart();
    })
})